Jasmine
A behavior-driven development framework for testing javascript code. It is a standalone framework with clean syntax and does not require a DOM.
Download Jasmine
Download the standalone distribution at the release page. The newest version at this moment is v2.2.0 as shown in the following figure. Click the jasmine-standalone-2.2.0.zip link to download.
Unzip the downloaded file. The structure of the directory hierarchy is displayed below.
- Test codes are placed in the /spec directory.
- Your Javascript codes (that are going to be tested) is placed in the /src directory.
- The /lib directory contains the required files for Jasmine framework.
The directory hierarchy does not matter. Source and test files just need to be included in the SpecRunner.html file
<!-- Line 14 to 18 in SpecRunner.html -->
<!-- include source files here... -->
<script src="src/sum.js"></script>
<!-- include spec files here... -->
<script src="spec/SumTestSpec.js"></script>
Run Tests
Open
SpecRunner.htmlin the browser and the tests will be run, showing the result in the browser. In this example, there are 5 test cases as shown in the following figure.
Change line 12 in
spec/PlayerSpec.jstoexpect(player.currentlyPlayingSong).not.toEqual(song)and run the tests again (refresh the webpage).
Now one of the test cases will fail as shown in the figure below.
Write Tests
Suites, Specs and Expectations are the core concepts of Jasmine.
Suites
A collection of similar test cases. In other words, Suites are used to group related test cases (Specs).
A Suite begins with a call to the global Jasmine function describe. For example,
describe('Suite Title', function() {
// code that will be executed during tests
};
Specs
A Spec is a test case that contains one or more expectations. An expectation is an assertion(true or false) that tests the status of your code.
A Spec passes when all the expectations inside is true and fails when one or more expectations is false.
A Spec begins with a call to the global Jasmine function it. For example,
it('Spec Title', function() {
// write code and expectation here
};
Expectations
An Expectation begins with the function expect that takes a value (called actual).
The Expectation is then chained with a Matcher function which takes the expected value.
The matcher will compare the actual and the expected value. If these two values are equal, the expectation will be true. Otherwise the expectation will be false.
var sum = function(a, b) {
return a + b;
};
var c = sum(1, 2);
// 'since c = 1 + 2 = 3, this expectation is true
expect(c).toBe(3);
// false expectation
expect(c).toBe(2);
A Simple Example
sum is a simple function that returns the summation of two numbers.
3 Specs and 1 Suite are grouped in a Suite for sum function. Each Spec represents a scenario and contains many expectations. Two Specs are grouped in a nested Suite because they are similar (one input parameter is zero).
describe('Sum Function', function() {
// group all Specs for sum function
it ('Two Positive Integers', function() {
// test cases where the two input parameters
// are two positive integers
});
it ('Two Negative Integers', function() {
// test cases where the two input parameters
// are two negative integers
});
it ('One Positive and One Negative Integer', function() {
// test cases where the two input parameters
// are one positive and one negatve integer
});
// Nested Suite
describe ('Integer and Zero', function() {
// group all Specs where one of the input
// parameters is zero
it ('Positive Integer and Zero', function() {
// the non-zero parameter is positive
});
it ('Negative Integer and Zero', function() {
expect(sum(-1, 0)).toBe(-1);
// the non-zero parameter is negative
})
});
});
The example can be viewed here
or cloned with
git clone https://github.com/iangemtek/SimpleJasmineExample.git
Open SpecRunner.html in the browser will run the tests.